<template>
  <common-list>
    <common-search slot="search" @search="handleQuery" @reset="resetQuery">
      <el-form
        :model="queryParams"
        ref="queryForm"
        @submit.native.prevent
        :inline="true"
        label-width="65px"
      >
        <el-form-item label="关键字" prop=" keyWords">
          <common-input
            v-model="queryParams.keyWords"
            clearable
            @enter="handleQuery"
          />
        </el-form-item>
        <el-form-item label="账号名" prop="userName">
          <common-input
            v-model="queryParams.userName"
            clearable
            :verify="false"
            @enter="handleQuery"
          />
        </el-form-item>
        <el-form-item label="源IP" prop="sourceIp">
          <common-input
            v-model="queryParams.sourceIp"
            clearable
            @enter="handleQuery"
          />
        </el-form-item>
        <el-form-item label="目标IP" prop="targetIp">
          <common-input
            v-model="queryParams.targetIp"
            clearable
            @enter="handleQuery"
          />
        </el-form-item>
        <el-form-item label="访问时间">
          <el-date-picker
            v-model="date"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            value-format="yyyy-MM-dd"
            end-placeholder="结束日期"
          >
          </el-date-picker>
        </el-form-item>
      </el-form>
    </common-search>
    <common-table
      slot="content"
      v-loading="loading"
      :data="list"
      row-key="dbId"
      @selection-change="handleSelectionChange"
    >
      <el-table-column
        label="接口"
        align="left"
        prop="apiUrl"
        show-overflow-tooltip
        fixed
      />
      <el-table-column
        label="敏感数据"
        align="left"
        prop="interfaceSensitiveData"
        show-overflow-tooltip
      />
      <el-table-column
        label="重要数据"
        align="left"
        prop="interfaceDataTag"
        show-overflow-tooltip
      />
      <el-table-column
        label="核心数据"
        align="left"
        prop="interfaceCoreData"
        show-overflow-tooltip
      />
      <el-table-column
        label="业务系统"
        align="left"
        prop="systemName"
        show-overflow-tooltip
      />
      <el-table-column
        label="账号名"
        prop="userName"
        show-overflow-tooltipshow-overflow-tooltip
      />

      <el-table-column
        label="源IP"
        align="left"
        prop="sourceIp"
        show-overflow-tooltip
      />

      <el-table-column
        label="目标IP"
        align="left"
        prop="targetIp"
        show-overflow-tooltip
      />

      <el-table-column
        label="访问时间"
        align="left"
        prop="createTime"
        width="180"
      />
    </common-table>
    <pagination
      slot="pagination"
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
  </common-list>
</template>

<script>
import { queryList } from "@/api/apisecurity/sensitiveDataAuditing";
import BaseList from "@/mixins/BaseList";
export default {
  name: "Info",
  components: {},
  mixins: [BaseList],
  data() {
    return {
      total: 0,
      list: [],
      loading: false,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: null,
        sourceIp: null,
        keyWords: null,
      }, // 查询参数
      date: [],
    };
  },
  mounted() {
    this.getList();
  },
  methods: {
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    resetQuery() {
      this.queryParams = this.$options.data().queryParams;
      this.date = [];
    },

    getList() {
      this.loading = true;
      if (this.date && this.date.length > 0) {
        this.queryParams.startTime = this.date[0];
        this.queryParams.endTime = this.date[1];
      } else {
        this.queryParams.startTime = null;
        this.queryParams.endTime = null;
      }
      queryList(this.queryParams)
        .then((res) => {
          if (res && res.code === 200) {
            this.list = res.rows;
            this.total = res.total;
          } else {
            this.list = [];
            this.total = 0;
            this.handleListTips(res);
          }
        })
        .finally(() => {
          this.loading = false;
        });
    },
  },
};
</script>
<style scoped lang="scss"></style>
